import {createRouter,createWebHistory} from "vue-router"
import useUserInfoStore from "../stores/userInfo.js"

import Layout from '../views/Layout.vue'
import Login from '../views/Login.vue'
import MainContent from '../views/MainContent.vue'
import UserInfo from "../views/user/UserInfo.vue"
import ArticleDetails from '../views/article/ArticleDetails.vue'
import ArticlePublish from '../views/article/ArticlePublish.vue'
import ArticleManagement from '../views/article/ArticleManagement.vue'
import UserSpace from '../views/user/UserSpace.vue'
import ArticleCategory from '../views/article/ArticleCategory.vue'
import Space from '../views/user/Space.vue'

import AdminPage from '../views/admin/AdminPage.vue'
import UserManage from '../views/admin/UserManage.vue'
import ArticleManage from '../views/admin/ArticleManage.vue'
import CommentManage from '../views/admin/CommentManage.vue'
import MainPage from '../views/admin/MainPage.vue'
import Error from '../views/404.vue'
import {ref} from "vue";


const routes = [
    {
        path:'/',
        redirect:'/layout'
    },
    {
        path: '/login',
        name: 'login',
        component: Login
    },
    {
        path: '/not-authorized',
        name: 'not-authorized',
        component: Error
    },
    {
        path: '/admin',
        name:'admin',
        component: AdminPage,
        children: [
            {
                path: '/about',
                name: 'about',
                component: MainPage
            },
            {
                path: '/user',
                name: 'user',
                component: UserManage
            },
            {
                path: '/article',
                name: 'article',
                component: ArticleManage
            },
            {
                path: '/comment',
                name: 'comment',
                component: CommentManage
            }
        ]
    },
    {
        path: '/layout',
        name: 'layout',
        component:Layout,
        children:[
            {
                path: '',
                redirect: '/main'
            },
            {
                path:'/main',
                name:'maincontent',
                component:MainContent
            },
            {
                path: '/userinfo',
                name: 'userinfo',
                component: UserInfo
            },
            {
                path: '/details/:id',
                name: 'articledetails',
                component:ArticleDetails
            },
            {
                path: '/articlepublish',
                name: 'articlepublish',
                component: ArticlePublish
            },
            {
                path: '/articlemanage',
                name: 'articlemanage',
                component: ArticleManagement
            },
            {
                path: '/userspace',
                name:'userspace',
                component: UserSpace
            },
            {
                path: '/space/:id',
                name: 'space',
                component: Space
            },
            {
                path: '/category/:type',
                name: 'articlecategory',
                component: ArticleCategory
            }
        ]
    }

]


const router = createRouter({
    history:createWebHistory(),
    routes:routes
})

router.beforeEach((to, from, next) => {
    const userInfoStore = useUserInfoStore();
    const userinfo = ref({...userInfoStore.info})
    if (to.path === '/admin' && userinfo.value.role !== 1) {
        next('/not-authorized'); // Redirect to a not authorized page
    } else {
        next(); // Allow navigation
    }
});

export default router